<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8"/>
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <meta name="description" content="学成在线中国优质的学习平台">
        <meta name="keywords" content="学习,IT,互联网,Python,C/C++,Linux,Golang">
        <title>学成在线-学习平台</title>
        <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon">
        <link rel="stylesheet" href="./css/base.css"/>
        <link rel="stylesheet" href="./css/index.css"/>
    </head>
    <body>
        <header>
            <div>
                <h3>
                    <a href="javascript:;">
                        <img src="./img/logo.png" alt="学成在线">
                    </a>
                </h3>
                <ul>
                    <li><a href="javascrit:;">首页</a></li>
                    <li><a href="javascrit:;">课程</a></li>
                    <li><a href="javascrit:;">职业规划</a></li>
                </ul>
                <div class="search">
                    <input type="text" placeholder="请输入关键词"/>
                    <div class="btn"></div>
                </div>
                <div class="user">
                    <img src="./img/user.png"><span>Penge</span>
                </div>
            </div>
        </header>
        <div class="banner">
            <div>
                <div class="left">
                    <ul>
                        <li><a href="javascript:;">前端开发</a></li>
                        <li><a href="javascript:;">后端开发</a></li>
                        <li><a href="javascript:;">移动开发</a></li>
                        <li><a href="javascript:;">人工智能</a></li>
                        <li><a href="javascript:;">商业预测</a></li>
                        <li><a href="javascript:;">云计算大数据</a></li>
                        <li><a href="javascript:;">运维测试</a></li>
                        <li><a href="javascript:;">UI设计</a></li>
                        <li><a href="javascript:;">产品</a></li>
                    </ul>
                </div>
                <div class="right">
                    <div class="title">我的课程</div>
                    <ul>
                        <li>
                            <h3>继续学习&nbsp;程序语言设计</h3>
                            <p>正在学习-使用对象</p>
                        </li>
                        <li>
                            <h3>继续学习&nbsp;程序语言设计</h3>
                            <p>正在学习-使用对象</p>
                        </li>
                        <li>
                            <h3>继续学习&nbsp;程序语言设计</h3>
                            <p>正在学习-使用对象</p>
                        </li>
                        <li>全部课程</li>
                    </ul>
                </div>
            </div>
            <ul>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
        </div>
        <nav>
            <ul>
                <li><a href="javascript:;">精品推荐</a></li>
                <li></li>
                <li><a href="javascript:;">JQuery</a></li>
                <li></li>
                <li><a href="javascript:;">Spark</a></li>
                <li></li>
                <li><a href="javascript:;">Python</a></li>
                <li></li>
                <li><a href="javascript:;">Spring</a></li>
                <li></li>
                <li><a href="javascript:;">MySQL</a></li>
                <li></li>
                <li><a href="javascript:;">JavaWeb</a></li>
                <li></li>
                <li><a href="javascript:;">修改兴趣</a></li>
            </ul>
        </nav>
        <aside></aside>
        <main>
            <section class="recommend">
                <div class="title">
                    <a href="javascript:;" class="left">精品推荐</a>
                    <a href="javascript:;" class="right">查看全部</a>
                </div>
                <ul>
                        <li>
                            <img src="./img/course01.png" alt="">
                            <h3>Think PHP 5.0 博客系统实战项目演练</h3>
                            <p><span>高级</span>·<span>1125人在学习</span></p>
                        </li>
                        <li>
                            <img src="./img/course02.png" alt="">
                            <h3>Android 网络图片加载框架详解</h3>
                            <p><span>高级</span>·<span>1125人在学习</span></p>
                        </li>
                        <li>
                            <img src="./img/course03.png" alt="">
                            <h3>Angular 2 最新框架+主流技术+项目实战</h3>
                            <p><span>高级</span>·<span>1125人在学习</span></p>
                        </li>
                        <li>
                            <img src="./img/course04.png" alt="">
                            <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                            <p><span>高级</span>·<span>1125人在学习</span></p>
                        </li>
                        <li>
                            <img src="./img/course05.png" alt="">
                            <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                            <p><span>高级</span>·<span>1125人在学习</span></p>
                        </li>
                        <li>
                            <img src="./img/course06.png" alt="">
                            <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                            <p><span>高级</span>·<span>1125人在学习</span></p>
                        </li>
                        <li>
                            <img src="./img/course07.png" alt="">
                            <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                            <p><span>高级</span>·<span>1125人在学习</span></p>
                        </li>
                        <li>
                            <img src="./img/course08.png" alt="">
                            <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                            <p><span>高级</span>·<span>1125人在学习</span></p>
                        </li>
                        <li>
                            <img src="./img/course02.png" alt="">
                            <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                            <p><span>高级</span>·<span>1125人在学习</span></p>
                        </li>
                        <li>
                            <img src="./img/course01.png" alt="">
                            <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                            <p><span>高级</span>·<span>1125人在学习</span></p>
                        </li>
                </ul>
            </section>
            <section class="program">
                <div class="title">
                    <a href="javascript:;" class="left">编程入门</a>
                    <ul>
                        <li>热门</li>
                        <li>初级</li>
                        <li>中级</li>
                        <li>高级</li>
                    </ul>
                    <a href="javascript:;" class="right">查看全部</a>
                </div>
                <img src="./img/left.jpg" alt="">
                <img src="./img/top.jpg" alt="">
                <ul>
                    <li>
                        <img src="./img/course01.png" alt="">
                        <h3>Think PHP 5.0 博客系统实战项目演练</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course02.png" alt="">
                        <h3>Android 网络图片加载框架详解</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course03.png" alt="">
                        <h3>Angular 2 最新框架+主流技术+项目实战</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course04.png" alt="">
                        <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                </ul>
            </section>
            <section class="data">
                <div class="title">
                    <a href="javascript:;" class="left">数据分析师</a>
                    <ul>
                        <li>热门</li>
                        <li>初级</li>
                        <li>中级</li>
                        <li>高级</li>
                    </ul>
                    <a href="javascript:;" class="right">查看全部</a>
                </div>
                <img src="./img/left.jpg" alt="">
                <img src="./img/top.jpg" alt="">
                <ul>
                    <li>
                        <img src="./img/course01.png" alt="">
                        <h3>Think PHP 5.0 博客系统实战项目演练</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course02.png" alt="">
                        <h3>Android 网络图片加载框架详解</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course03.png" alt="">
                        <h3>Angular 2 最新框架+主流技术+项目实战</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course04.png" alt="">
                        <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                </ul>
            </section>
            <section class="machine">
                <div class="title">
                    <a href="javascript:;" class="left">机器学习工程师</a>
                    <ul>
                        <li>热门</li>
                        <li>初级</li>
                        <li>中级</li>
                        <li>高级</li>
                    </ul>
                    <a href="javascript:;" class="right">查看全部</a>
                </div>
                <ul>
                    <li>
                        <img src="./img/course01.png" alt="">
                        <h3>Think PHP 5.0 博客系统实战项目演练</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course02.png" alt="">
                        <h3>Android 网络图片加载框架详解</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course03.png" alt="">
                        <h3>Angular 2 最新框架+主流技术+项目实战</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course04.png" alt="">
                        <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course05.png" alt="">
                        <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                </ul>
            </section>
            <section class="front">
                <div class="title">
                    <a href="javascript:;" class="left">前端开发工程师</a>
                    <ul>
                        <li>热门</li>
                        <li>初级</li>
                        <li>中级</li>
                        <li>高级</li>
                    </ul>
                    <a href="javascript:;" class="right">查看全部</a>
                </div>
                <ul>
                    <li>
                        <img src="./img/course01.png" alt="">
                        <h3>Think PHP 5.0 博客系统实战项目演练</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course02.png" alt="">
                        <h3>Android 网络图片加载框架详解</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course03.png" alt="">
                        <h3>Angular 2 最新框架+主流技术+项目实战</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course04.png" alt="">
                        <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                    <li>
                        <img src="./img/course05.png" alt="">
                        <h3>Android Hybrid APP开发实战 H5+原生！</h3>
                        <p><span>高级</span>·<span>1125人在学习</span></p>
                    </li>
                </ul>
            </section>
        </main>
        <footer>
            <div>
                <div>
                    <img src="./img/logo.png" alt="">
                    <p>学成在线致力于普及中国最好的教育它与中国一流大学和机构合作提供在线课程。
                        &copy; 2017年XTCG Inc.保留所有权利。-沪ICP备15025210号</p>
                    <div class="btn">下载APP</div>
                </div>
                <ul>
                    <li>关于学成网</li>
                    <li><a href="javascript:;">关于</a></li>
                    <li><a href="javascript:;">管理团队</a></li>
                    <li><a href="javascript:;">工作机会</a></li>
                    <li><a href="javascript:;">客户服务</a></li>
                    <li><a href="javascript:;">帮助</a></li>
                </ul>
                <ul>
                    <li>新手指南</li>
                    <li><a href="javascript:;">如何注册</a></li>
                    <li><a href="javascript:;">如何选课</a></li>
                    <li><a href="javascript:;">如何拿毕业证</a></li>
                    <li><a href="javascript:;">学分是什么</a></li>
                    <li><a href="javascript:;">考试未通过怎么办</a></li>
                </ul>
                <ul>
                    <li>合作伙伴</li>
                    <li><a href="javascript:;">合作机构</a></li>
                    <li><a href="javascript:;">合作导师</a></li>
                </ul>
            </div>
        </footer>
    </body>
</html>